<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>金川集团数字化</title>
    <link rel="stylesheet" href="../css/reset.css">
    <link rel="stylesheet" href="../css/common.css">
    <link rel="stylesheet" href="../css/style.css">
    <style>

        iframe {
            margin: 0;
            padding: 0;
            width: 100%;
            height: 100%;
            border: none;
            overflow: hidden;
            visibility: hidden;
            opacity: 0;
            position: fixed;
            left: 0;
            top: 0;
            background: none;
        }

        iframe.on {
            visibility: visible;
            opacity: 1;
        }

        body {
            width: 100vw;
            height: 100vh;
        }
    </style>
</head>
<body style="background-image: url('../img/default_bg.jpg');background-size: 100% 100%">

<!--警告窗口-->
<div class="alert_box">
    <div class="alert_close"></div>
    <p class="alert_title el"></p>
    <p class="alert_tips el2"></p>
</div>

<!--额外弹出窗口-->
<div class="pop_box_change hide">
    <div class="pop_page">
        <div class="close_pop"></div>
        <div class="title">更多联系人</div>
        <div class="custom_tabs fix">
            <div class="custom_tabs_item on">内部联系人</div>
            <div class="custom_tabs_item">外部联系人</div>
            <div class="custom_tabs_item">应急联系人</div>
        </div>
        <div class="pop_content">

        </div>
    </div>
</div>


<!--生产调度中心的弹出选项-->
<div class="page_cover"></div>


<div class="ten_pop_select hide">
    <img class="left_tips l" src="../img/ten_select_tips.png" alt="">
    <div class="item_box l">
        <div class="select_item"
             data-url="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/153665815401492480">
            密闭空间作业
        </div>
        <div class="select_item"
             data-url="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/154190777845575680">
            有毒气体泄漏
        </div>
        <div class="select_item"
             data-url="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/154190810640838656">
            高空作业危险
        </div>
        <div class="select_item"
             data-url="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/154190825419468800">
            火灾
        </div>
    </div>
    <div class="item_arrow l" id="openSelectTen"> ></div>

</div>

<div class="ten_select hide" id="tenSelect">
    <div class="select_item"
         data-url="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/153665815401492480">
        密闭空间作业
    </div>
    <div class="select_item"
         data-url="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/154190777845575680">
        有毒气体泄漏
    </div>
    <div class="select_item"
         data-url="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/154190810640838656">
        高空作业危险
    </div>
    <div class="select_item"
         data-url="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/154190825419468800">
        火灾
    </div>
</div>
<!--通用弹出窗口-->
<div class="pop_box hide">
    <div class="pop_page">
        <div class="close_pop"></div>
        <div class="title"></div>
        <div class="tips_info">
        </div>

        <div class="pop_content">
        </div>
        <img class="pop_line" src="../img/pop_line.png" alt="">
        <div class="file_box">
            <div class="file_tips">
                <img src="../img/pop_file_arrow.png" alt="">
                具体详见 <span></span>
            </div>

            <div class="file_tabs fix">

            </div>
            <div class="file_item_box">

            </div>
        </div>
    </div>
</div>

<div class="four_tabs hide">
    <div class="show_btn"></div>
    <div class="pa" style="width: 650px;position: absolute;left: 50%;margin-left: -305px">
        <div class="four_tabs_btn four_tabs_btn1" data-page="5_1"></div>
        <div class="four_tabs_btn four_tabs_btn2" data-page="5_2"></div>
        <div class="four_tabs_btn four_tabs_btn3" data-page="5_3"></div>
        <div class="four_tabs_btn four_tabs_btn4" data-page="5_4"></div>
    </div>
</div>

<!--侧边栏-->
<div class="side_menu_box">
    <div>
        <div class="side_menu_item hide on">
            <img class="menu_img" src="../img/menu1.png" alt="">
            金川总览
        </div>
        <div class="side_menu_item hide">
            <img class="menu_img" src="../img/menu2.png" alt="">
            金川头条
        </div>
        <div class="side_menu_item hide">
            <img class="menu_img" src="../img/menu3.png" alt="">
            印记篇
        </div>
        <div class="side_menu_item hide">
            <img class="menu_img" src="../img/menu7.png" alt="">
            航行篇
        </div>

        <div class="side_menu_item hide">
            <img class="menu_img" src="../img/menu4.png" alt="">
            智造篇
        </div>
        <div class="side_menu_item hide">
            <img class="menu_img" src="../img/menu5.png" alt="">
            生态篇
        </div>
        <div class="side_menu_item hide">
            <img class="menu_img" src="../img/menu6.png" alt="">
            智信篇
        </div>
        <div class="side_menu_item hide">
            <img class="menu_img" src="../img/menu8.png" alt="">
            守护篇
        </div>
        <div class="side_menu_item hide">
            <img class="menu_img" src="../img/menu9.png" alt="">
            智远篇
        </div>
        <div class="side_menu_item hide">
            <img class="menu_img" src="../img/menu10.png" alt="">
            生产调度中心
        </div>
    </div>
    <div class="menu_switch">
        <img class="menu_arrow" src="../img/menu_arrow.png" alt="">
    </div>
</div>
<!--页面-->
<div class="iframe_box">
    <iframe class="on"
            data-page="1"
            src="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/1402"
            frameborder="0"></iframe>
    <iframe data-page="2"
            src="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/1403"
            frameborder="0"></iframe>
    <iframe data-page="3"
            src="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/152723098779545600"
            frameborder="0"></iframe>
    <iframe data-page="4"
            src="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/154181086847463424"
            frameborder="0"></iframe>

    <iframe data-page="5_1"
            src="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/153815924244246528"
            frameborder="0"></iframe>
    <iframe data-page="5_2"
            src="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/153997693423742976"
            frameborder="0"></iframe>
    <iframe data-page="5_3"
            src="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/154003221363322880"
            frameborder="0"></iframe>
    <iframe data-page="5_4"
            src="http://172.22.4.23/scada?sceneId=e768f9cf860a4e33a9caae30bfd49f95"
            frameborder="0"></iframe>
    <iframe data-page="6"
            src="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/154753218109272064
" frameborder="0"></iframe>
    <iframe data-page="7"
            src="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/153631572803743744"
            frameborder="0"></iframe>
    <iframe data-page="8"
            src="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/153819874060169216"
            frameborder="0"></iframe>

    <iframe data-page="9"
            src="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/154034028431831040"
            frameborder="0"></iframe>
    <iframe data-page="10"
            src="/modules/vueNewVersion/dist/index.html?menuId=477&service=VISU-CONTROL#/view/153489102627434496"
            frameborder="0"></iframe>
    <iframe data-page="10_1"
            src=""
            frameborder="0"></iframe>

</div>


</body>
<script type="text/javascript" charset="utf-8" src="../js/jquery-3.1.1.min.js"></script>
<script type="text/javascript" charset="utf-8" src="../js/common.js"></script>
<script>
	$(function () {

    // getNavInfo()

		//开机24小时刷新
		setTimeout(() => {
			location.reload();
		}, 1000 * 60 * 60 * 24)


		//预警
		getTimesData();

		//关闭弹出层
		$('.alert_close').on('click', function () {
			$('.alert_box').removeClass('on');
			$('.alert_title').html('');
		})

		if (getUserAgent().type !== 'firefox' && getUserAgent().type !== 'chrome') {
			alert('请使用新版本谷歌浏览器或火狐浏览器达到最佳体验效果');
		} else {
			if (getUserAgent().type === 'chrome' && getUserAgent().no.split('.')[0] * 1 < 60) {
				alert('请使用新版本谷歌浏览器或火狐浏览器达到最佳体验效果');
			}
			if (getUserAgent().type === 'firefox' && getUserAgent().no.split('.')[0] * 1 < 60) {
				alert('请使用新版本谷歌浏览器或火狐浏览器达到最佳体验效果');
			}
		}

		var inContacts = '';//内部联系人
		var outContacts = '';//外部联系人
		var meetContacts = '';//紧急联系人

		window.addEventListener('message', function (e) {

			if (e.data.type === 'openPop') {//打开头条弹出层
				openPopPage({
					title: e.data.data.title,
					time: e.data.data.createTime,
					company: e.data.data.draftingUnitName,
					content: e.data.data.dtlContent,
					fileId: e.data.data.attachDtlId,
				})
			} else if (e.data.type === 'openTenSelect') {//弹出第十屏选择弹窗
				$('.page_cover').show();
				$('#tenSelect').fadeIn();
			} else if (e.data.type === 'openPopBlack') {//打开头条弹出层
				openPopPage({
					title: '黑名单供应商',
					time: e.data.data.screenDate,
					company: '',
					content: e.data.data.ratingDes,
					fileId: '',
				})
			} else if (e.data.type === 'openCustomerPop') {//弹出第十屏/2 的查看联系人
				let type = e.data.data;
				getJson('/api/WEB-SQL/websql/openInterface/scddzx_yjgl_type?categoryNo=YJGL&type=' + type + '&limit=1', {}, function (res) {
					inContacts = res.data[0].inContacts;
					outContacts = res.data[0].outContacts;
					meetContacts = res.data[0].meetContacts;
					$('.custom_tabs').find('.custom_tabs_item').removeClass('on').eq(0).addClass('on');
					$('.pop_box_change .pop_content').html(inContacts);
					$('.pop_box_change').fadeIn()
				})
			} else if (e.data.type === 'openControls') {
				getJson('/api/DATA-MANAGE/hk/artemis', {}, function (res) {
					if (res.code === 200) {
						window.open(vars.hkUrl)
					}
				})
			}
		}, false);


		/**
		 * 切换内外联系人
		 */
		$('body').on('click', '.custom_tabs_item', function () {
			$(this).addClass('on').siblings().removeClass('on');
			let idx = $(this).index()
			if (idx === 1) {
				$('.pop_box_change .pop_content').html(dealEditorContent(outContacts));
			} else if (idx === 2) {
				$('.pop_box_change .pop_content').html(dealEditorContent(meetContacts));
			} else {
				$('.pop_box_change .pop_content').html(dealEditorContent(inContacts));
			}
		})


		/**
		 * 关闭第十屏弹出层
		 */
		$('.page_cover').on('click', function () {
			$('.page_cover').hide();
			$('#tenSelect').fadeOut();
		})


		/**
		 * 智造篇底部展开收起
		 * */
		$('.four_tabs').on('click', '.show_btn', function () {
			if ($('.four_tabs').hasClass('on')) {
				$('.four_tabs').removeClass('on');
			} else {
				$('.four_tabs').addClass('on');
			}
		})

		/**
		 * 智造篇底部展开收起
		 * */
		$('.four_tabs').on('click', '.four_tabs_btn', function () {
			if ($(this).hasClass('on')) {
				return
			}
			$(this).addClass('on').siblings().removeClass('on');
			$('.four_tabs').removeClass('on');
			let page = $(this).data('page');
			$('.iframe_box').find('iframe[data-page=' + page + ']').addClass('on').fadeIn().siblings('iframe').removeClass('on').hide();
		})


		/**
		 * 选择弹窗
		 */
		$('body').on('click', '.select_item', function () {
			$('.page_cover').hide();
			$('#tenSelect').fadeOut();
			let url = $(this).data('url');
			$('.iframe_box').find('iframe[data-page=10_1]').attr('src', url).addClass('on').fadeIn().siblings('iframe').removeClass('on').hide();
		})


		/**
		 * 打开某个窗口
		 */
		$('body').on('click', '.side_menu_item', function () {
			$(this).addClass('on').siblings('.side_menu_item').removeClass('on');
			let idx = $(this).index();
			// $('.iframe_box').find('iframe').eq(idx).addClass('on').siblings('iframe').removeClass('on');
			$('.side_menu_box').removeClass('on');
			$('.iframe_box').find('iframe[data-page=10_1]').attr('src', '');

			let dom = $('.iframe_box').find('.on');
			let url = dom.attr('src');
			dom.attr('src', '');
			setTimeout(() => {
				dom.attr('src', url);
			}, 100)

			$('.four_tabs').removeClass('on').hide();
			$('.ten_pop_select').removeClass('on').hide();
			if (idx === 4) {//智造篇
				$('.four_tabs').removeClass('on').show();
				$('.iframe_box').find('iframe[data-page=5_1]').addClass('on').fadeIn().siblings('iframe').removeClass('on').hide();
				$('.four_tabs').find('.four_tabs_btn').eq(0).addClass('on').siblings().removeClass('on');
			} else if (idx === 9) {//生产调度中心
				$('.ten_pop_select').show();
				$('.iframe_box').find('iframe[data-page=' + (idx + 1) + ']').addClass('on').fadeIn().siblings('iframe').removeClass('on').hide();
			} else {
				$('.iframe_box').find('iframe[data-page=' + (idx + 1) + ']').addClass('on').fadeIn().siblings('iframe').removeClass('on').hide();
			}
		})


		/**
		 * 是否打开菜单
		 */
		$('body').on('click', '.menu_switch', function () {
			if ($('.side_menu_box').hasClass('on')) {
				$('.side_menu_box').removeClass('on');
			} else {
				$('.side_menu_box').addClass('on');
			}
		})

		/**
		 * 切换文件选项卡
		 */
		$('body').on('click', '.file_tabs .file_tabs_item', function () {
			let idx = $(this).index();
			$(this).addClass('on').siblings('.file_tabs_item').removeClass('on');
			$('.file_item_box').find('.file_item').eq(idx).addClass('on').siblings('.file_item').removeClass('on');
		})

		/**
		 * 切换文件选项卡
		 */
		$('body').on('click', '.close_pop', function () {
			$('.pop_box,.pop_box_change').fadeOut()
		})

		/**
		 * 打开弹出层页面
		 * @param data
		 */
		function openPopPage(data) {
			$('.pop_box').find('.title').text(data.title)
			let str = ''
			if (data.time) {
				str += '发布时间：' + data.time;
			}
			if (data.company) {
				str += ' 发布单位：' + data.company;
			}

			$('.pop_box').find('.tips_info').text(str)
			$('.pop_box').find('.pop_content').html(dealEditorContent(data.content));
			$('.file_item_box,.file_tabs').html('');
			if (data.fileId) {

				getJson('api/WEB-SQL/websql/openInterface/attachments?attachmentId=' + data.fileId, {}, function (res) {
					$('.pop_box').find('.pop_page').removeClass('no_file');

					let str = res.data.map((e, i) => {
						return '附件' + (i + 1)
					}).join(' ');
					$('.pop_box').find('.file_tips span').text(str);

					for (let i = 0; i < res.data.length; i++) {
						$('.file_tabs').append(`<div class="file_tabs_item">附件${i + 1}</div>`);
						let iconCode = '';
						if (res.data[i].url.includes('.doc')) {
							iconCode = '&#xe859;';
						} else if (res.data[i].url.includes('.xls')) {
							iconCode = '&#xe858;';
						} else if (res.data[i].url.includes('.ppt')) {
							iconCode = '&#xe85a;';
						} else {
							iconCode = '&#xe857;';
						}

						$('.file_item_box').append(`<a class="file_item" href="${vars.url + 'api/BASE-SERVER/sys/oss/local/' + res.data[i].id}" target="_blank">
                <i class="iconfont">${iconCode}</i>${res.data[i].originalFilename}</a>`);
						$('.file_tabs').find('.file_tabs_item').eq(0).addClass('on');
						$('.file_item_box').find('.file_item').eq(0).addClass('on');
					}
				})


			} else {
				$('.pop_box').find('.pop_page').addClass('no_file');
			}

			$('.pop_box').fadeIn();
		}

		/**
		 * 展开第10屏选项
		 */
		$('#openSelectTen').on('click', function () {
			if ($('.ten_pop_select').hasClass('on')) {
				$('.ten_pop_select').removeClass('on')
			} else {
				$('.ten_pop_select').addClass('on')
			}
		})
	})
</script>
</html>
